<template>
	<view class="page">
		<view class="page-ctx">
			<view class="addr-wrap">
				<view class="addr-item" @click="toChooseAddress()">
					<view class="addr-inner">
						<view class="addr-left">
							<view class="icon-box">
								<image src="@/static/payment/addr-marker.png"></image>
							</view>
							<view class="info-box" v-if="address_selected && address_selected.name">
								<view class="user-info">
									<text class="name">{{address_selected.name}}</text>
									<text class="phone">{{address_selected.phone}}</text>
									<text class="desc" v-if="address_selected.moren == 1">[默认地址]</text>
								</view>
								<view class="address-info">
									{{address_selected.full_addr}}
									<view class="address-detail">
										{{address_selected.address}}
									</view>
								</view>
							</view>

							<view class="addr-empty" v-else>
								请选择收货地址
							</view>
						</view>

						<view class="addr-right flex-center">
							<image src="@/static/payment/arrow.png"></image>
						</view>
					</view>
				</view>
			</view>

			<view class="products-wrap">
				<view class="sec-title">
					商品详情
				</view>
				<view class="product-list">
					<view class="product-item flex" v-for="(item,index) in payment_products" :key="index">
						<view class="poster-box">
							<image :src="item.image" mode="aspectFill"></image>
						</view>
						<view class="info">
							<view class="title-box">
								<view class="title ellipsis-2">
									{{item.title}}
								</view>
							</view>
							<view class="guige-box">
								<view class="guige ">
									{{item.keyVals }}
								</view>
							</view>

							<view class="price-info flex-between">
								<view class="price">
									<text class="huobi">￥</text>
									<text class="price-val">{{item.priceSale || 0}}</text>
								</view>

								<view class="number-box">
									<text class="num">x {{item.num}}</text>
								</view>
							</view>
						</view>
					</view>
				</view>

				<view class=" peisong-info flex-between">
					<view class="label">
						配送服务
					</view>
					<view class="value">
						快递派送
					</view>
				</view>
				<view class="remark-info flex-between" @click="openRemarkPop()">
					<view class="label">
						订单备注
					</view>
					<view class="value flex">
						<text class="text ellipsis-1">{{remark}}</text>
						<image class="arrow" src="@/static/payment/arrow.png" mode=""></image>
					</view>
				</view>
			</view>



			<view class="box-item box-price">
				<div class="mingxi-title">
					价格明细
				</div>

				<view class="mingxi-list">
					<view class="mingxi-item flex-between">
						<view class="label">
							商品总价
						</view>
						<view class="num">
							共{{total_product_number}}件商品
						</view>
						<view class="value">
							￥{{pay_info.goodsPrice}}
						</view>
					</view>
					<!-- <view class="mingxi-item flex-between">
						<view class="label">
							外贸满减
						</view>
						<view class="num">
							
						</view>
						<view class="value">
							-￥{{pay_info.foreignManjian }}
						</view>
					</view> -->
					<!-- <view class="mingxi-item flex-between">
						<view class="label">
							外贸运费
						</view>
						<view class="num">
	
						</view>
						<view class="value">
								￥{{pay_info.foreignYunfei }}
						</view>
					</view> -->

					<view class="mingxi-item flex-between">
						<view class="label">
							配送费
						</view>
						<view class="num">
							<!-- 满100免配送费 -->
						</view>
						<view class="value">
							{{pay_info.yunfei || '免运费' }}
						</view>
					</view>

					<view class="mingxi-item flex-between" v-if="pay_info.zhekou != 10 && pay_info.zhekou != 0">
						<view class="label">
							会员折扣
						</view>
						<view class="num">
							<!-- 白银会员 -->
							{{pay_info.zhekou}}折
						</view>
						<view class="value">
							-￥{{pay_info.zhekouPrice}}
						</view>
					</view>

					<view class="mingxi-item flex-between" @click="openPointsPop()">
						<view class="label">
							积分抵扣
						</view>
						<view class="num">
							<text v-if="!order_points_dixian_number">请选择抵扣积分</text>
							<text v-else>{{jifenrule.jifen}}积分减1元</text>
						</view>
						<view class="value flex">
							<text class="value-text" v-if="order_points_dixian_number">- ￥{{order_points_dixian_price}}</text>
							<image class="arrow" src="@/static/payment/arrow.png" mode=""></image>
						</view>
					</view>

					<view class="mingxi-item flex-between" @click="openCouponPop()">
						<view class="label">
							优惠券
						</view>
						<view class="num">
							{{coupon_selected.id ? coupon_selected.title : '选择优惠券'}}
						</view>
						<view class="value flex">
							<text class="value-text" v-if="coupon_selected.id">- ￥{{coupon_selected.jian}}</text>
							<image class="arrow" src="@/static/payment/arrow.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="total-info flex-between">
					<view class="label">
						合计应付
					</view>
					<view class="value">
						￥ {{ real_payment_money}}
					</view>
				</view>
			</view>

			<view class="box-item box-pay">
				<view class="pay-info " v-if="pay_type_value == 'weixin'">
					<view class="pay-type flex-between" @click="openPaymentOptions()">
						<text class="label">支付方式</text>
						<view class="value flex">
							<image class="icon" src="@/static/payment/type-weixin.png" mode=""></image>
							<text>微信支付</text>
							<image class="arrow" src="@/static/order/arrow.png" mode=""></image>
						</view>
					</view>
				</view>

				<view class="pay-info" v-else-if="pay_type_value == 'yue'">
					<view class="pay-type flex-between" @click="openPaymentOptions()">
						<text class="label">支付方式</text>
						<text class="num">可用余额：{{my_info.money}}</text>
						<view class="value flex">
							<image class="icon" src="@/static/payment/type-yue.png" mode=""></image>
							<text>余额支付</text>
							<image class="arrow" src="@/static/order/arrow.png" mode=""></image>
						</view>
					</view>
				</view>
				
				<view class="pay-info" v-else-if="pay_type_value == 'yongjin'">
					<view class="pay-type flex-between" @click="openPaymentOptions()">
						<text class="label">支付方式</text>
						<text class="num">可用佣金：{{my_info.commission||"0"}}</text>
						<view class="value flex">
							<image class="icon" src="@/static/payment/yongjin.png" mode=""></image>
							<text>佣金支付</text>
							<image class="arrow" src="@/static/order/arrow.png" mode=""></image>
						</view>
					</view>
				</view>

				<view class="pay-info" v-else-if="pay_type_value == 'xianxia'">
					<view class="pay-type flex-between" @click="openPaymentOptions()">
						<text class="label">支付方式</text>
						<view class="value flex">
							<image class="icon" src="@/static/payment/type-xianxia.png" mode=""></image>
							<text>线下支付</text>
							<image class="arrow" src="@/static/order/arrow.png" mode=""></image>
						</view>
					</view>

					<view class="box-xianxia">
						<view class="info-box">
							<div class="box-title">
								收款对公账户
							</div>

							<view class="box-loop-wrap">
								<!-- <view class="tabs-wrap">
									<u-tabs :current="xianxia_account_index" :scrollable="false" :list="xianxia_account_list"
										keyName="title" lineColor="#CB0011" :lineWidth="28" :lineHeight="2" @click="xianxia_tabClick"
										:itemStyle="{height: '50px',fontSize: '28rpx',color:'#B3B9C9'}"
										:activeStyle="{fontWeight: 'bold',color: '#000000' }" :inactiveStyle="{}"></u-tabs>
								</view> -->


								<view class="box-loop" v-for="(item,index) in xianxia_account_list">
									<view class="box-info">
										<view class="label">
											公司全称
										</view>
										<view class="value" @click="doCopyAccountInfo(item.company)">
											{{item.company}}
											<image src="@/static/common/copy.png" mode=""></image>
										</view>
									</view>
									<view class="box-info">
										<view class="label">
											对公开户行
										</view>
										<view class="value" @click="doCopyAccountInfo(item.bankName)">
											{{item.bankName}}
											<image src="@/static/common/copy.png" mode=""></image>
										</view>
									</view>
									<view class="box-info">
										<view class="label">
											对公账户
										</view>
										<view class="value" @click="doCopyAccountInfo(item.bankAccount)">
											{{item.bankAccount}}
											<image src="@/static/common/copy.png" mode=""></image>
										</view>
									</view>
								</view>
							</view>

						</view>

						<view class="info-box upload-wrap">
							<div class="box-title">
								上传转账凭证
							</div>
							<view class="upload-box">
								<view class="upload-list">
									<view class="upload-item" v-for="(pic,index) in uploadImages" :key="index" @click="doPreview(pic)">
										<view class="remore-box flex-center" @click.stop="doRemove(pic, index)">
											<image class="upload-remove" src="@/static/feedback/remove.png" mode=""></image>
										</view>
										<view class="poster-box">
											<image class="upload-image" :src="pic" mode="aspectFill"></image>
										</view>
									</view>
									<view class="upload-item" @click="doUpload()" v-if="uploadImages.length < 6">
										<image class="upload-icon" src="@/static/payment/type-xianxia-upload.png" mode=""></image>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>

			</view>



			<view class="box-item box-pay" @click="open_invoice()">
				<view class="pay-info">
					<view class="pay-type flex-between">
						<text class="label">发票信息</text>
						<view class="value flex">
							<text>{{invoice_info.invoiceStatus == 1 ? '开票' : '不开票'}}</text>
							<image class="arrow" src="@/static/order/arrow.png" mode=""></image>
						</view>
					</view>
				</view>
			</view>

		</view>

		<w_bottom_safe height="140" />

		<view class="page-foot">
			<view class="safe-fixed-bottom">

				<view class="price-box flex">
					<view class="text">
						合计应付：
					</view>
					<text class="huobi">￥</text>
					<text class="value">{{real_payment_money}}</text>
				</view>
				<button class="btn flex-center" :disabled="false" @click="toOrderSubmit()">
					提交订单
				</button>
			</view>
		</view>

		<order_remark_pop ref="order_remark_pop" @confirm="confirmRemark" />
		<order_points_deduction_pop ref="order_points_deduction_pop" @confirm="confirmPoints" />
		<order_choose_coupon_pop ref="order_choose_coupon_pop" @confirm="confirmCoupon" />
		<invoice_pop ref="invoice_pop" @confirm="confirm_invoice" />
		<order_payment_methods_choose_pop ref="order_payment_methods_choose_pop" @confirm="confirmPaymentType" />
	</view>
</template>

<script>
	import dayjs from 'dayjs';

	import order_remark_pop from '@/components/order/order_remark_pop.vue'
	import order_points_deduction_pop from '@/components/order/order_points_deduction_pop.vue'; //积分抵扣
	import order_choose_coupon_pop from '@/components/order/order_choose_coupon_pop.vue' //优惠券
	import invoice_pop from '@/components/invoice/invoice_pop.vue' //发票
	import order_payment_methods_choose_pop from '@/components/order/order_payment_methods_choose_pop.vue'

	export default {
		components: {
			order_remark_pop,
			order_points_deduction_pop,
			order_choose_coupon_pop,
			invoice_pop,
			order_payment_methods_choose_pop,
		},
		data() {
			return {
				is_test_pay_order: true, //测试假支付

				from: '', //product-detail  ||  cart
				is_miaosha: 0,
				cuxiaoId: '',
				//
				address_selected: {}, //地址
				pagination_address: {
					page: 1,
					pageNum: 20
				},
				coupon_selected: {}, //优惠券
				coupons_for_allow_use: [],
				remark: '',
				//
				payment_products: [],
				total_product_number: 0,
				total_product_price: 0, //商品总金额
				total_order_price: 0, //订单总金额
				order_zhekou_bili: 10, //折扣比例 10折 默认不打折
				order_zhekou_price: 0, //折扣金额
				order_yunfei: 0, //运费金额
				order_points_dixian_price: 0, //积分抵现金额
				order_points_dixian_number: 0, //使用积分数量


				pay_info: {}, //预下单信息
				jifen_pay: {
					// if_open: 1,//是否开启积分抵现
					// jifen: "17",//可用积分
					// money: "1.70",//可抵扣金额
					// rule: 10//抵扣比例 rule 积分抵扣 1元
				}, //积分抵现信息
				//

				my_info: {}, //我的信息 包含 余额 佣金数值
				//
				invoice_info: {
					invoiceStatus: 0, //是否开票 0-不需要 1-需要发票
					invoiceType: '1', //发票类型：1-普通发票 2-专用发票
					titleType: '1', //抬头：1-个人 2-单位
					title: '', //
					shibiema: '', //
					companyAddress: '', //
					companyPhone: '', //
					bankName: '', //
					bankNo: '', //
				},
				// 支付方式
				pay_type_value: 'weixin',
				valueMap: {
					'weixin': {
						value: 'weixin',
						title: '微信支付',
					},
					'yue': {
						value: 'yue',
						title: '余额支付',
					},
					'xianxia': {
						value: 'xianxia',
						title: '线下支付',
					},
				},


				uploadImages: [], //线下凭证上传
				allow_upload_number: 1, //最大上传数量限制
				xianxia_account_list: [],
				xianxia_account_select: {},
				
				jifenrule:{},
			}
		},

		computed: {
			real_payment_money() {
				// let money = parseFloat((this.total_order_price - this.order_points_dixian_price).toFixed(2))
				let money = parseFloat((this.pay_info.orderPrice - this.order_points_dixian_price).toFixed(2))
				return money
			}
		},

		onLoad(option) {
			this.from = option.from || '';
			this.is_miaosha = option.is_miaosha || '';
			this.cuxiaoId = option.cuxiaoId || '';

			this.getCacheProduct();
			this.query_xianxia_account();
		},
		onShow() {
			this.query_user();
			this.query_address();
			this.query_pay_info();
		},
		onHide() {},

		onPullDownRefresh() {

		},
		onReachBottom() {

		},
		methods: {
			//下单成功后 移除商品信息
			clearCacheProduct() {
				if (this.from == 'cart') {
					//移除购物车中商品
					let inventoryId = this.payment_products.map(v => v.inventoryId).join(',')
					this.$api({
						url: '/service.php',
						method: 'get',
						data: {
							action: 'gouwuche_del',
							inventoryId: inventoryId, //产品规格id(多个用,分开)
						},
					}).then(res => {
						if (res.code == 200) {
							this.$store.commit('set_vuex_cart_number', res.data.count)
						}
					})
				}
				uni.removeStorageSync('cache_payment_products')
			},
			//获取缓存的产品信息
			getCacheProduct() {
				//本地产品数据
				let cache_payment_products = uni.getStorageSync('cache_payment_products');
				if (cache_payment_products) {
					this.payment_products = JSON.parse(cache_payment_products)

					let total_product_number = 0;
					let total_product_price = 0;
					this.payment_products.forEach(v => {
						total_product_number += parseInt(v.num)
						total_product_price += v.priceSale * parseInt(v.num)
					})
					this.total_product_number = total_product_number;
					this.total_product_price = total_product_price;
					console.log(total_product_price, 's数量11')
					this.$log('缓存 待下单产品', this.payment_products)
				} else {

				}
			},
			//获取缓存的地址信息

			//
			query_user() {
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'users_userInfo',
					},
				}).then(res => {
					if (res.code == 200) {
						this.my_info = res.data;
					}
				})
			},


			query_xianxia_account() {
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'pay_getOfflineBanks',
					},
				}).then(res => {
					if (res.code == 200) {
						let list = res.data;
						list.forEach((v, index) => {
							v.title = '账户' + (index + 1)
						})
						this.xianxia_account_list = list;
						this.xianxia_account_select = this.xianxia_account_list[0] || {}
					}
				})
			},

			query_address() {
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'userAddress_lists',
						...this.pagination_address,
					},
				}).then(res => {
					if (res.code == 200) {
						let data = res.data
						let list = res.data;
						list.forEach(v => {
							v.full_addr = [v.country, v.province, v.city, v.area].filter(v => !!v).join('-');
							// v.xing = v.name[0] || ''
						})


						let cache_payment_address_id = uni.getStorageSync('cache_payment_address_id');
						console.log('缓存的地址id  cache_payment_address_id', cache_payment_address_id)
						let cache_index = list.findIndex(v => v.id == cache_payment_address_id);
						let default_index = list.findIndex(v => v.moren == 1);

						if (cache_index > -1) {
							this.address_selected = list[cache_index]
						} else {
							uni.removeStorageSync('cache_payment_address_id')
							if (default_index > -1) {
								this.address_selected = list[default_index]
							} else {
								this.address_selected = {}
							}
						}

					}
					this.hideLoading()
				})
			},


			get_pay_info_params() {
				let product_items = this.payment_products.map(v => ({
					"inventoryId": v.inventoryId,
					"productId": v.productId,
					"num": v.num
				}))
				let productInfo = JSON.stringify(product_items)

				let params = {
					productInfo: productInfo,
					addressId: this.address_selected.id || '',
					yhqId: this.coupon_selected.id || '',
				}
				return params
			},


			query_pay_info() {
				let params = this.get_pay_info_params();
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'orders_getPayInfo',
						...params
					},
				}).then(res => {
					if (res.code == 200) {
						let data = res.data;
						this.pay_info = data;
						this.jifen_pay = data.jifen_pay || {}; //积分信息
						this.jifenrule = data.jifenrule || {}

						//
						this.total_order_price = data.orderPrice || 0


						//this.total_product_price = data.goods_price || 0;
						this.order_zhekou_bili = parseFloat(data.zhekou) || 10
						this.order_zhekou_price = parseFloat(data.zhekou_price) || 0
						this.order_yunfei = data.yunfei || 0;


						this.format_coupon_view_info(data.yhqList)
						this.coupons_for_allow_use = data.yhqList || []
						// this.total_product_price = data.goods_price;

						if (this.coupon_selected.id) {
							this.total_order_price = (this.total_order_price - this.coupon_selected.jian).toFixed(2)
						}
					} else {
						uni.showModal({
							title: "提示",
							content: res.message,
							confirmText: "确定",
							showCancel: false,
							success: (res) => {
								this.toBack({
									time: 1000
								})
							}
						})
					}
					// this.hideLoading()
				})

			},

			// 格式化优惠券展示信息
			format_coupon_view_info(list) {
				list.forEach(v => {
					v.man = parseFloat(v.man);
					v.jian = parseFloat(v.jian);
					v.tiaojian = v.man == 0 ? '无门槛' : `满${v.man}元可用`
				})
			},


			//选择地址
			toChooseAddress() {
				this.toRoute({
					path: '/address-list',
					query: {
						from: 'order'
					}
				})
			},

			//订单备注
			openRemarkPop() {
				this.$refs.order_remark_pop.init()
			},
			confirmRemark(value) {
				this.$log('订单备注', value)
				this.remark = value
			},

			//积分抵现
			openPointsPop() {
				this.$refs.order_points_deduction_pop.init(this.pay_info, this.real_payment_money)
			},
			confirmPoints(value) {
				this.$log('积分抵扣', value)
				// this.remark = value
				this.order_points_dixian_number = value; //使用积分数量
				this.order_points_dixian_price = parseFloat((value / (this.jifenrule.jifen)).toFixed(2)); //积分抵现金额
			},

			//优惠券
			openCouponPop() {
				this.$refs.order_choose_coupon_pop.init(this.coupons_for_allow_use, this.real_payment_money)
			},
			confirmCoupon(item) {
				this.$log('订单选择优惠券', item)
				this.coupon_selected = item;
				this.query_pay_info()
			},

			// 支付方式
			openPaymentOptions() {
				this.$refs.order_payment_methods_choose_pop.init()
			},


			confirmPaymentType(value) {
				console.log('支付方式', value)
				this.pay_type_value = value;
			},


			// 发票信息
			open_invoice() {
				this.$refs.invoice_pop.init()
			},
			confirm_invoice(info) {
				this.invoice_info = {
					invoiceStatus: info.invoiceStatus || '', //是否开票 0-不需要 1-需要发票
					invoiceType: info.invoiceType || '',
					titleType: info.titleType || '',
					title: info.title || '',
					shibiema: info.shibiema || '',
					companyAddress: info.companyAddress || '',
					companyPhone: info.companyPhone || '',
					bankName: info.bankName || '',
					bankNo: info.bankNo || '',
				}
			},

			toOrderSubmit() {
			

				if (!this.address_selected.id) {
					this.$alert('请选择收货地址')
					return
				}

				if (!this.pay_type_value == 'xianxia') {
					if (!this.uploadImages.length) {
						this.$alert('请上传转账凭证信息')
						return
					}
				}

				this.mix_throttle(this.doOrderSubmitFn);
			},




			get_pay_params() {
				let product_items = this.payment_products.map(v => ({
					"inventoryId": v.inventoryId,
					"productId": v.productId,
					"num": v.num
				}))
				let productInfo = JSON.stringify(product_items)

				let params = {
					addressId: this.address_selected.id || '',
					productInfo: productInfo,
					yhqId: this.coupon_selected.id || '', //优惠券记录ID
				}
				return params
			},

			doOrderSubmitFn() {
				this.showLoading({
					title: '订单提交中',
					disClose: true
				});


				let params = this.get_pay_params();

				let paramsOrder = {
					action: 'orders_create',
					...params,
					
					jifen:this.order_points_dixian_number, //使用了多少积分
					peisongType: 1, //配送类型：1-快递物流 2-上门自提
					peisongTime: '', //配送时间
					yhqId: this.coupon_selected.id || '', //优惠券记录ID
					tuanId: '', //参与拼团的团ID
					tuanType: '', //拼团类型：0-普通订单 1-普通团 2-社区团
					remark: this.remark,
					orderType: 0, //订单类型：0-普通订单 1-拼团订单 2-秒杀订单 3-积分订单
					cuxiaoId: this.cuxiaoId || '',
					...this.invoice_info, //发票信息
					
					
					
					
				}

				if (this.cuxiaoId) {
					paramsOrder.orderType = 2;
				}



				this.$log('要提交的表单数据', params)

				// return
				this.$api({
					url: '/service.php',
					method: 'get',
					data: paramsOrder,
				}).then(res => {
					if (res.code == 200) {
						this.order_id = res.data.id;
						this.do_order_pay();
						// this.hideLoading();
					} else {
						this.hideLoading();
						this.$alert(res)
					}
					// this.hideLoading()
				})
			},

			do_order_pay() {
				if (this.order_points_dixian_number > 0) {
					this.use_jifen_pay();
				}else{
					if (this.pay_type_value == 'yue') {
						this.pay_use_yue();
					} else if (this.pay_type_value == 'weixin') {
						this.pay_use_weixin();
					} else if (this.pay_type_value == 'xianxia') {
						this.pay_use_xianxia();
					}else if (this.pay_type_value == 'yongjin') {
						this.pay_use_yongjin();
					}
				}
			},


			// 余额支付
			pay_use_yue() {
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'pay_balance',
						orderType: 1,
						orderId: this.order_id,
					},
				}).then((res) => {
					this.$alert(res)
					if (res.code == 200) {
						this.toPaySuccess();
					} else {}
				});
			},

			// 微信支付
			pay_use_weixin() {
				this.showLoading({
					title: '支付信息请求中',
					disClose: true
				})
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'pay_weixin',
						orderType: 1,
						orderId: this.order_id,
					},
				}).then(res => {
					// this.$alert(res)
					let data = res.data;

					// if (this.is_test_pay_order) {
					// 	this.toPaySuccess()
					// 	return
					// }

					if (res.code == 200) {
						uni.requestPayment({
							provider: 'wxpay',
							timeStamp: String(data.timeStamp),
							nonceStr: data.nonceStr,
							package: data.package,
							signType: data.signType,
							paySign: data.paySign,
							success: (res) => {
								console.log('支付成功', res)

								this.toPaySuccess()
							},
							fail: (err) => {
								this.$alert('支付失败');
								setTimeout(() => {
									this.toPayFail();
								}, 1000)
								// console.log('支付失败', err)
							},
							complete: () => {
								this.hideLoading();
							}
						});
					} else {
						this.$alert(res)
					}

					// #ifdef H5
					this.hideLoading();
					// #endif
				})
			},


			// 余额支付
			pay_use_xianxia() {
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'pay_offline',
						orderType: 1,
						orderId: this.order_id,
						bankId: this.xianxia_account_select.id || '',
						remark: this.remark,
						images: this.uploadImages.join(','),
					},
				}).then((res) => {
					this.$alert(res)
					if (res.code == 200) {
						// this.toPaySuccess();
					} else {

					}
					this.toRoute({
						mode: 'reLaunch',
						path: '/order-list'
					})
				});
			},
			
			
			//佣金支付
			pay_use_yongjin(){
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'pay_commission',
						orderType: 1,
						orderId: this.order_id,
					},
				}).then((res) => {
					this.$alert(res)
					if (res.code == 200) {
						this.toPaySuccess();
					} else {}
				});
			},


			// 积分抵现
			use_jifen_pay() {
				this.$api({
					url: '/service.php',
					method: 'get',
					data: {
						action: 'pay_jifen',
						orderType:1,//1-商品订单
						orderId: this.order_id,
						jifen: this.order_points_dixian_number, //需要抵扣的积分
					},
				}).then(res => {
					// this.$alert(res)
					let data = res.data;
					if (res.code == 200) {
						if (res.isOver == 1) {
							this.toPaySuccess()
						} else {
							if (this.pay_type_value == 'yue') {
								this.pay_use_yue();
							} else if (this.pay_type_value == 'weixin') {
								this.pay_use_weixin();
							} else if (this.pay_type_value == 'xianxia') {
								this.pay_use_xianxia();
							} else if (this.pay_type_value == 'yongjin') {
								this.pay_use_yongjin();
								console.log('yongjin');
							}
						}
					} else {
						this.$alert(res)
					}
				})
			},



			toPaySuccess() {
				this.toPayResult(1)
			},
			toPayFail() {
				// this.toPayResult(0)

				this.toRoute({
					path: '/order-detail',
					query: {
						from: 'payment',
						id: this.order_id,
					},
					mode: 'reLaunch'
				})
			},

			//
			toPayResult(is_pay = 0) {
				this.clearCacheProduct()

				this.toRoute({
					path: '/payment-success',
					query: {
						order_id: this.order_id,
						type: 'order',
						is_pay: is_pay,
					},
					// mode: 'redirectTo'
				})
			},





			//线下图片上传处理
			doCopyAccountInfo(data) {
				uni.setClipboardData({
					data: `${data}`,
					success: () => {
						console.log('复制')
						this.$alert('已复制')
					}
				})
			},
			// 上传
			doPreview(pic) {
				uni.previewImage({
					urls: [pic],
				});
			},
			doUpload() {
				// #ifdef H5
				this.do_h5_upload();
				// #endif

				// #ifndef H5
				this.do_mp_upload();
				// #endif
			},

			// H5环境上传图片
			do_h5_upload() {
				let count = this.allow_upload_number - this.uploadImages.length
				uni.chooseImage({
					count: count || 1,
					mediaType: ['image'], // 图片// ['image', 'video']	
					sourceType: ['album', 'camera'], // 从相册选择
					sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
					success: (res) => {
						console.warn('选择图片 success', res)

						// tempFilePaths  路径列表
						// tempFiles			文件列表
						res.tempFiles.forEach(file => {
							this.$apiUpload({
								url: '/service.php',
								method: 'post',
								data: {
									action: 'index_localUpload',
									img: file.path,
									if_touxiang: 0,
								},
							}).then(res => {
								if (res.code == 200) {
									let pic = res.data;
									this.uploadImages.push(pic)
								}
							});
						})
					}
				});
			},

			// 小程序环境上传图片
			do_mp_upload() {

				console.log('dianjile111')
				let count = this.allow_upload_number - this.uploadImages.length
				uni.chooseMedia({
					count: count || 1,
					mediaType: ['image'], // 图片// ['image', 'video']	
					sourceType: ['album', 'camera'], // 从相册选择
					sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
					success: (res) => {
						console.warn('选择图片 success', res)

						// tempFilePaths  路径列表
						// tempFiles			文件列表 【{tempFilePath: '临时路径'}】
						res.tempFiles.forEach(file => {
							this.$apiUpload({
								url: '/service.php',
								method: 'post',
								data: {
									action: 'index_localUpload',
									img: file.tempFilePath,
									// if_touxiang: 0,
								},
							}).then(res => {
								if (res.code == 200) {
									let pic = res.data;
									this.uploadImages.push(pic)
								}
							});
						})
					}
				});
			},

			doRemove(pic, index) {
				this.uploadImages.splice(index, 1)
			},
			// 上传

		}
	}
</script>

<style lang="scss">
	page {
		background: #fff;
	}
</style>

<style lang="scss" scoped>
	.page {}

	.page-ctx {
		padding: 24rpx 32rpx;
	}


	.box-item {
		margin-bottom: 24rpx;
		padding: 32rpx 24rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 16rpx 2rpx rgba(0, 0, 0, 0.08);
		border-radius: 16rpx 16rpx 16rpx 16rpx;
	}




	.addr-wrap {
		margin-bottom: 24rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 16rpx 2rpx rgba(0, 0, 0, 0.08);
		border-radius: 16rpx 16rpx 16rpx 16rpx;

		.addr-item {
			padding: 24rpx 0 0;
			background: #FFFFFF;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
		}

		.addr-inner {
			margin: 0 0;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding-bottom: 36rpx;

			.addr-left {
				display: flex;
				align-items: center;
				flex: 1;
				overflow: hidden;
				padding-right: 20rpx;

				.icon-box {
					padding: 24rpx;

					image {
						width: 56rpx;
						height: 56rpx;
					}
				}

				.ico-dai {
					padding: 24rpx;


					.xing {
						width: 56rpx;
						height: 56rpx;
						background: #4D9EFA;
						font-size: 28rpx;
						font-weight: bold;
						color: #FFFFFF;

						text-align: center;
						border-radius: 50%;
					}
				}

				.user-info {
					.name {
						font-size: 28rpx;
						font-weight: bold;
						color: #000000;
						margin-right: 24rpx;
					}

					.phone {
						font-size: 28rpx;
						color: #333333;
						margin-right: 32rpx;
					}

					.desc {
						font-family: PingFang SC, PingFang SC;
						font-weight: 400;
						font-size: 24rpx;
						color: #CB0011;
					}
				}

				.address-info {
					font-size: 24rpx;
					margin-right: 0;
					margin-top: 12rpx;

					view {
						margin-top: 6rpx;
					}
				}


				.addr-empty {
					font-size: 28rpx;
					color: #666666;
				}
			}

			.addr-right {
				align-self: stretch;
				width: 72rpx;


				image {
					width: 14rpx;
					height: 24rpx;
				}
			}
		}
	}

	.products-wrap {
		padding: 32rpx 24rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 16rpx 2rpx rgba(0, 0, 0, 0.08);
		border-radius: 16rpx 16rpx 16rpx 16rpx;

		.sec-title {
			margin-bottom: 24rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 28rpx;
			color: #222222;
		}

		.product-list {
			.product-item {
				padding: 16rpx 0;

				&+.product-item {
					border-top: 1rpx solid #eee;
				}

				.poster-box {
					width: 176rpx;
					height: 176rpx;
					border-radius: 10rpx;
					overflow: hidden;

					image {
						width: 176rpx;
						height: 176rpx;
					}
				}

				.info {
					flex: 1;
					overflow: hidden;
					padding-left: 20rpx;
					// width: calc(100% - 140rpx);

					.title-box {
						height: 80rpx;
					}

					.title {
						font-family: PingFang SC, PingFang SC;
						font-weight: bold;
						font-size: 28rpx;
						color: #222222;
						line-height: 1.5;
					}


					.guige-box {
						height: 30rpx;
						margin-top: 12rpx;
					}

					.guige {
						font-family: PingFang SC, PingFang SC;
						font-weight: 400;
						font-size: 24rpx;
						color: #B3B9C9;
					}

					.price-info {
						margin-top: 12rpx;

						.price {
							.huobi {
								font-family: PingFang SC, PingFang SC;
								font-weight: 800;
								font-size: 20rpx;
								color: #000000;
							}

							.price-val {
								font-family: PingFang SC, PingFang SC;
								font-weight: bold;
								font-size: 28rpx;
								color: #000000;
							}
						}

						.number-box {
							.num {
								font-family: PingFang SC, PingFang SC;
								font-weight: bold;
								font-size: 28rpx;
								color: #000000;
							}
						}
					}
				}
			}
		}
	}


	.peisong-info {
		padding: 15rpx 0;

		.label {
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 24rpx;
			color: #222222;
		}

		.value {
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 24rpx;
			color: #000000;
		}
	}

	.remark-info {
		padding: 15rpx 0;

		.label {
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 24rpx;
			color: #222222;
		}

		.value {
			flex: 1;
			overflow: hidden;

			.text {
				flex: 1;
				padding-left: 80rpx;

				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #000000;
			}

			.arrow {
				margin-left: 20rpx;
				width: 14rpx;
				height: 24rpx;
			}
		}
	}



	.box-user {
		margin-top: 24rpx;

		.user-title {
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 28rpx;
			color: #222222;
		}

		.input-items {
			margin-top: 34rpx;

			.input-item {
				margin-bottom: 16rpx;

				input {
					padding: 0 24rpx;
					height: 72rpx;
					line-height: 72rpx;
					background: #F8F8F8;
					border-radius: 8rpx 8rpx 8rpx 8rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					font-size: 24rpx;
					color: #000;
				}

				.input-p {
					background: #F8F8F8;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					font-size: 24rpx;
					color: #777;
				}
			}
		}



	}




	.box-price {
		margin-top: 24rpx;

		.mingxi-title {
			font-family: PingFang SC, PingFang SC;
			font-weight: bold;
			font-size: 28rpx;
			color: #222222;
		}

		.mingxi-list {}

		.mingxi-item {
			margin-top: 20rpx;


			.label {
				margin-right: 20rpx;
				// width: 160rpx;
				min-width: 160rpx;
				min-width: 5em;

				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 24rpx;
				color: #222222;
			}

			.num {
				flex: 1;
				text-align: left;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #B3B9C9;
			}

			.value {
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 24rpx;
				color: #222222;

				.value-text {
					font-family: PingFang SC, PingFang SC;
					font-weight: bold;
					font-size: 24rpx;
					color: #222222;
				}

				.arrow {
					margin-left: 20rpx;
					width: 14rpx;
					height: 24rpx;
				}
			}
		}

		.total-info {
			border-top: 1rpx solid #F8F8F8;
			margin-top: 32rpx;
			padding-top: 32rpx;

			.label {
				font-family: PingFang SC, PingFang SC;
				font-weight: 800;
				font-size: 28rpx;
				color: #222222;
			}

			.value {
				font-family: PingFang SC, PingFang SC;
				font-weight: 800;
				font-size: 28rpx;
				color: #000000;
			}
		}

	}




	.box-pay {
		padding: 0;

		.pay-info {
			.pay-type {
				padding: 24rpx 24rpx;

				.label {
					font-family: PingFang SC, PingFang SC;
					font-weight: bold;
					font-size: 28rpx;
					color: #222222;
				}


				.num {
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					font-size: 24rpx;
					color: #222222;
				}

				.value {

					// flex: 1;
					// overflow: hidden;
					.icon {
						margin-right: 24rpx;
						width: 40rpx;
						height: 40rpx;
					}

					text {
						font-family: PingFang SC, PingFang SC;
						font-weight: 400;
						font-size: 28rpx;
						color: #000000;
					}

					.value-1 {
						font-family: PingFang SC, PingFang SC;
						font-weight: 400;
						font-size: 28rpx;
						color: #000000;
					}

					.arrow-box {
						height: 40rpx;
					}

					.arrow {
						margin-right: 0;
						margin-left: 24rpx;
						width: 14rpx;
						height: 24rpx;
					}

				}
			}

			.box-xianxia {
				padding: 10rpx 24rpx;
				margin-top: 0rpx;

				.info-box {
					.box-title {
						font-family: PingFang SC, PingFang SC;
						font-weight: bold;
						font-size: 28rpx;
						color: #000000;
					}


					.box-loop {
						&+.box-loop {
							margin-top: 20rpx;
							border-top: 1rpx solid #eee;
						}
					}

					.box-info {
						margin-top: 20rpx;
						display: flex;
						justify-content: space-between;
						align-items: center;




						.label {
							font-family: PingFang SC, PingFang SC;
							font-weight: bold;
							font-size: 24rpx;
							color: #000000;
						}

						.value {
							display: inline-flex;
							align-items: center;
							font-family: PingFang SC, PingFang SC;
							font-weight: 400;
							font-size: 24rpx;
							color: #000000;

							image {
								margin-left: 16rpx;
								width: 24rpx;
								height: 24rpx;
							}
						}
					}
				}


				.upload-wrap {
					margin-top: 32rpx;

					.upload-box {
						margin-top: 24rpx;

						image {}
					}
				}
			}
		}
	}


	.page-foot {
		.price-box {
			flex: 1;
			overflow: hidden;

			.text {
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #222222;
			}

			.huobi {
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 32rpx;
				color: #222222;
			}

			.value {
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				font-size: 32rpx;
				color: #222222;
			}
		}

		.btn {
			width: 224rpx;
			height: 80rpx;
			background: #CB0011;
			border-radius: 40rpx 40rpx 40rpx 40rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			font-size: 28rpx;
			color: #FFFFFF;

			&.btn-disabled {
				background: #DDDDDD;
			}

			&[disabled] {
				background: #DDDDDD;
			}
		}
	}









	// 线下转账凭证
	.upload-list {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;


		.upload-item {
			margin-bottom: 24rpx;
			margin-right: 16rpx;
			position: relative;
			width: 202rpx;
			height: 198rpx;
			background: #F6FAFD;
			background: #fff;
			border-radius: 8rpx 8rpx 8rpx 8rpx;

			&:nth-child(3n) {
				margin-right: 0;
			}

			.upload-icon {
				width: 100%;
				height: 100%;
				border-radius: 8rpx 8rpx 8rpx 8rpx;
			}

			.poster-box {
				width: 100%;
				height: 100%;

				.upload-image {
					width: 100%;
					height: 100%;
					border-radius: 8rpx 8rpx 8rpx 8rpx;
				}
			}



			.remore-box {
				position: absolute;
				z-index: 10;
				right: -20rpx;
				top: -20rpx;
				width: 60rpx;
				height: 60rpx;

				.upload-remove {
					width: 32rpx;
					height: 32rpx;
				}
			}
		}
	}
</style>